<template>
  <el-dialog
    v-model="dialogEndable"
    :title="dialogTitle"
    :before-close="handleClose"
  >
    <el-form :model="form">
      <el-form-item label="技术名称">
        <el-input v-model="technology.name" />
      </el-form-item>
    </el-form>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="closeDialog">取消</el-button>
        <el-button type="primary" @click="formSubmit">
          确认
        </el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script>
import { post } from '../utils/common/api'

export default {
  data() {
    return {
      dialogEndable: false,

      dialogTitle: '编辑技术信息 No.123',

      id: 123,

      technology: {
        name: 'DocMan'
      }
    }
  },

  methods: {
    openDialog() {
      this.dialogEndable = true
    },

    closeDialog() {
      this.dialogEndable = false
    },

    setTechnology(id, tech) {
      this.id = id
      this.technology = JSON.parse(JSON.stringify(tech))
      this.dialogTitle = `编辑技术信息 No.${id}`
    },

    formSubmit() {
      var that = this
      post('/technology/update', {
        id: that.id,
        mod: that.technology
      }).then(function(res) {
        that.$emit('update', res)
        ElNotification({
          title: '修改成功',
          message: `您刚刚修改了技术 ${res.name} ，编号 No.${res.id}`,
          type: 'success',
          position: 'bottom-right',
        })
        that.closeDialog()
      })
    }
  }
}
</script>

<style scoped>

</style>
